<template>
	<page-meta><navigation-bar :title="!setdata?'添加实盘':'修改实盘'" front-color="#000000" background-color="#ffffff" /></page-meta>
	<view style="padding: 0 20px;">
		<view class="inp-box">
			<text>账号 <span style="color: #168deb;padding-left: 15px;font-size: 14px;" @tap="$go('/pages/center/kefu')">(需要客服协助)</span></text>
			<input type="text" v-model="shisetdata.accountNo" class="up" placeholder="请输入账户名" />
		</view>
		<view class="inp-box">
			<text>密码</text>
			<input type="text" v-model="shisetdata.pwd" class="up" placeholder="请输入账户密码"/>
		</view>
		<view class="inp-box">
			<text>授权码Authcode <span style="color: #168deb;padding-left: 15px;font-size: 14px;" @tap="$go('/pages/center/shuoming?url=' + $store.state.url + '/adddealerremark.html')">说明</span></text>
			<textarea style="height: 90px;" v-model="shisetdata.code" placeholder="" class="up" placeholder="请输入账户授权码" />
		</view>
		<view class="inp-box">
			<text>BrokerID <span style="color: #168deb;padding-left: 15px;font-size: 14px;" @tap="$go('/pages/center/shuoming?url=' + $store.state.url + '/adddealerremark.html')">说明</span></text>
			<input type="text" v-model="shisetdata.broker" class="up"/>
		</view>
		<view class="inp-box">
			<text>appid <span style="color: #168deb;padding-left: 15px;font-size: 14px;" @tap="$go('/pages/center/shuoming?url=' + $store.state.url + '/adddealerremark.html')">说明</span></text>
			<input type="text" v-model="shisetdata.appid" class="up"/>
		</view>
		<view class="inp-box">
			<text>交易接口 <span style="color: #168deb;padding-left: 15px;font-size: 14px;" @tap="$go('/pages/center/shuoming?url=' + $store.state.url + '/adddealerremark.html')">说明</span></text>
			<text class="select" @tap="open">{{jiekouname}}</text>
		</view>
		<view class="inp-box">
			<text>交易商 <span style="color: #168deb;padding-left: 15px;font-size: 14px;" @tap="$go('/pages/center/shuoming?url=' + $store.state.url + '/adddealerremark.html')">说明</span></text>
			<text class="select" @tap="open1">{{jysname}}</text>
		</view>
		<view class="inp-box">
			<text>交易地址 <span style="color: #168deb;padding-left: 15px;font-size: 14px;" @tap="$go('/pages/center/shuoming?url=' + $store.state.url + '/adddealerremark.html')">说明</span></text>
			<input type="text" v-model="shisetdata.address" class="up" placeholder="交易地址" style="width: 75%;float: left;"/>
			<input type="number" v-model="shisetdata.duankou" class="up" placeholder="端口" style="width: 20%;float: left;margin-left: 5%;"/>
		</view>
		<button type="default" v-if="!setdata" @tap="sub" style="background: #168deb;color: #fff;line-height: 40px;width: 100%;margin: 30px 0;">添加</button>
		<button type="default" v-else @tap="shiset" style="background: #168deb;color: #fff;line-height: 40px;width: 100%;margin: 30px 0;">修改</button>
		<uni-popup type="bottom" ref="adshi">
			<view style="background: #fff;min-height: 200px;">
				<text v-for="i in jklst" @click="selimg(i)" style="text-indent: 20px;font-size: 14px;color: #3b4144;display: block;padding: 10px 0;border-bottom: 1px solid #ccc;">{{i.name}}</text>
			</view>
		</uni-popup>
		<uni-popup type="bottom" ref="adshi1">
			<view style="background: #fff;min-height: 200px;">
				<text v-for="i,d in jyslst" @click="selimg1(i,d)" style="text-indent: 20px;font-size: 14px;color: #3b4144;display: block;padding: 10px 0;border-bottom: 1px solid #ccc;">{{i.name}}</text>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				Url:this.$store.state.url1,
				jklst:[],
				jyslst:[],
				shisetdata: { //实盘数据修改/添加
					"address":'',
					"duankou":'',
					"broker":'',
					"id": 0,
					"managerID": 0,
					"accountNo": "", // 实盘 账号
					"pwd": "",
					//密码
					"dealerID": 1,
					//期货商 Id
					"traderApiID":1, //交易接口 id
					"traderApi":null, //交易接口 id
					"dealer":null,
					"code": "",
					// 授权码
					"appid": "", //appid
					"state": 0,
					//登录状态
					"exchangeArea": 0, //内外盘（1：外盘，2内盘）
					"token": this.$store.state.user.token,
					"text":''
				},
				jiekouname:'0',
				jysname:'0',
				setdata:false
			}
		},
		methods: {
			open(obj) {
				this.$refs.adshi.open();
			},
			close() {
				this.$refs.adshi.close();
			},
			open1(obj) {
				this.$refs.adshi1.open();
			},
			close1() {
				this.$refs.adshi1.close();
			},
			selimg(obj,type){
				this.shisetdata.traderApiID = obj.id;
				this.ByApiId(this.shisetdata,type);
				this.jiekouname = obj.name;
				// console.log(obj)
				this.close();
			},
			selimg1(obj,idx){
				this.shisetdata.dealerID = obj.id;
				this.jysname = obj.name;
				this.setdrees(idx);
				this.close1();
			},
			getdata(){
				var _this = this;
				_this.getname();
			},
			ByApiId: function(obj,type) { //期货商
			
				var _this = this;
				// console.log( _this.Url + '/api/Dealers/GetDealersByApiId?token=' + _this.$store.state.user.token + '&apiId='+ obj.traderApiID)
				uni.request({
					method: 'get',
					url: _this.Url + '/api/Dealers/GetDealersByApiId?token=' + _this.$store.state.user.token + '&apiId='+ obj.traderApiID,
					// contentType: "application/json;",
					// data: json,
					success: function(data) {
						// console.log(data.data , '期货商list')
						data = data.data;
						if (data.code == 200) {
							_this.jyslst = data.data;
							if(type){
								for(var i in data.data){
									if(data.data[i].id == _this.setdata.dealerID){
										obj.dealerID = data.data[i].id;
										_this.jysname = data.data[i].name;
										// console.log(i)
										_this.setdrees(i)
										break;
									}
								}
							}else{
								// console.log(data.data)
								obj.dealerID = data.data[0].id;
								_this.jysname = data.data[0].name;
								_this.setdrees(0)
							}
							
							
						} else {
						}
					}
				})
			},
			setdrees(idx){
				var _this = this;
				// console.log(_this.jyslst[idx])
				if(!_this.jyslst[idx].address1) return;
				var txt = _this.jyslst[idx].address1;
				
				// _this.shisetdata.address + ":"+_this.shisetdata.duankou
				_this.shisetdata.address = txt.split(':')[0];
				_this.shisetdata.duankou = txt.split(':')[1];
			},
			getname: function(obj) { //接口类型
				var _this = this;
				uni.request({
					method: 'get',
					url: _this.Url + '/api/TraderApis/getNames?token=' + _this.$store.state.user.token,
					// contentType: "application/json;",
					// data: json,
					success: function(data) {
						// console.log(data.data,'接口类型list')
						data= data.data;
						if (data.code == 200) {
							_this.jklst = data.data;
							_this.jiekouname = _this.jklst[0].name;
							_this.shisetdata.traderApiID = _this.jklst[0].id;
							// console.log(_this.jklst)
							if(_this.setdata){
								for(var i in _this.jklst){
									if(_this.jklst[i].id == _this.setdata.traderApiID) {
										_this.selimg(_this.jklst[i],true);
										break
									}
								}
							}else{
								_this.ByApiId(_this.shisetdata);
							}
						} else {
							// alert(data.msg)
						}
					}
				})
			},
			sub(){
				// console.log(1222)
					var _this = this;
					if(!_this.shisetdata.accountNo){
						uni.showToast({
							title: '账号不能为空！',
							icon: 'none'
						});
						return;
					}
					if(!_this.shisetdata.pwd){
						uni.showToast({
							title: '密码不能为空！',
							icon: 'none'
						});
						return ;
					}
					if(!_this.shisetdata.code){
						uni.showToast({
							title: '授权码不能为空！',
							icon: 'none'
						});
						return ;
					}
					if(!_this.shisetdata.appid){
						uni.showToast({
							title: 'appid不能为空！',
							icon: 'none'
						});
						return ;
					}
					if(!_this.shisetdata.address){
						uni.showToast({
							title: '交易地址不能为空！',
							icon: 'none'
						});
						return ;
					}
					if(!_this.shisetdata.duankou){
						uni.showToast({
							title: '端口号不能为空！',
							icon: 'none'
						});
						return ;
					}
					var newo = {
						
					}; 
					for(var i in _this.shisetdata){
						var is = _this.shisetdata[i];
						newo[i] = is;
					};
					newo.accountNo = _this.shisetdata.accountNo;
					newo.pwd = _this.shisetdata.pwd;
					newo.appid = _this.shisetdata.appid;
					newo.code = _this.shisetdata.broker?_this.shisetdata.code + ',' +_this.shisetdata.broker:_this.shisetdata.code;
					newo.traderApiID = _this.shisetdata.traderApiID;
					newo.dealerID = _this.shisetdata.dealerID;
					newo.address = _this.shisetdata.address + ":"+_this.shisetdata.duankou;
					// console.log(newo)
					// return;
					uni.request({
						method: 'post',
						url: _this.Url + '/api/DealerAccount/AddDealerAccount',
						contentType: "application/json;",
						data: JSON.stringify(newo),
						success: function(data) {
							// console.log(data)
							data = data.data;
							if (data.code == 200) {
								uni.showToast({
									title: '添加成功！',
									icon: 'none',
									duration:2000
									// position:'top'
								});
								setTimeout(function(){
									uni.navigateBack();
								},2000)
								
							} else {
								uni.showToast({
									title: data.msg,
									icon: 'none',
									duration:2000
									// position:'top'
								});
							}
						}
					})
			},
			shiset: function(obj) {
				var _this = this;
				var newo = {
					
				}; 
				for(var i in _this.shisetdata){
					var is = _this.shisetdata[i];
					newo[i] = is;
				};
				console.log(_this.shisetdata.duankou)
				newo.accountNo = _this.shisetdata.accountNo;
				newo.pwd = _this.shisetdata.pwd;
				newo.appid = _this.shisetdata.appid;
				newo.code = _this.shisetdata.broker?_this.shisetdata.code + ',' +_this.shisetdata.broker:_this.shisetdata.code;
				newo.traderApiID = _this.shisetdata.traderApiID;
				newo.dealerID = _this.shisetdata.dealerID;
				newo.address = _this.shisetdata.address + ":"+_this.shisetdata.duankou;
				console.log(newo.address)
				uni.request({
					method: 'post',
					url: _this.Url + '/api/DealerAccount/edit',
					contentType: "application/json;",
					data: JSON.stringify(newo),
					success: function(data) {
						// console.log(data.data)
						data = data.data;
						if (data.code == 200) {
							uni.showToast({
								title: '修改成功！',
								icon: 'none',
								duration:2000
								// position:'top'
							});
							setTimeout(function(){
								uni.navigateBack();
							},2000)
						} else {
							uni.showToast({
								title: data.msg,
								icon: 'none',
								duration:2000
								// position:'top'
							});
						}
					}
				})
			}
		},
		onShow() {
			var _this = this;
			uni.getNetworkType({
				success: function(res) {
					if (res.networkType == 'none') {
						uni.showToast({
							title: '当前无网络连接，请检查！',
							icon: 'none',
							duration: 5000
			
							// position:'top'
						});
					}
				}
			});
			uni.onNetworkStatusChange(function(res) {
				if (!res.isConnected) {
					uni.showToast({
						title: '当前无网络连接，请检查！',
						icon: 'none',
						duration: 3000
						// position:'top'
					});
				} else {
					uni.showToast({
						title: '网络已连接！',
						icon: 'none',
						duration: 3000
						// position:'top'
					});
					_this.getdata();
				}
			});
			if(_this.setdata){
				for(var i in _this.setdata){
					var is = _this.setdata[i];
					_this.shisetdata[i] = is;
				};
			};
			this.getdata();
		},
		onLoad(e) {
			if(e.obj){
				this.setdata = JSON.parse(e.obj)
				console.log(this.setdata)
				if(this.setdata.code && this.setdata.code.indexOf(',') != -1){
					this.setdata.broker = this.setdata.code.split(',')[1];
					this.setdata.code = this.setdata.code.split(',')[0];
				}
				if(this.setdata.address && this.setdata.address.indexOf(':') != -1){
					this.setdata.duankou = this.setdata.address.split(':')[1];
					this.setdata.address = this.setdata.address.split(':')[0];
					// console.log(this.setdata.duankou)
				}
			}
		}
	}
</script>

<style scoped>
	.inp-box{
		line-height: 30px;
		margin-top: 15px;
		overflow: hidden;
	}
	.inp-box uni-text{display: block;box-sizing: border-box;text-align: left;font-size: 14px;}
	.inp-box uni-text:last-of-type{width: 100%;border: 1px solid #ccc;text-indent: 10px;}
	.inp-box uni-text:first-of-type{width: 100%;border: 0;text-indent: 0;}
	
	.inp-box .up{width: 100%;border: 1px solid #ccc;text-indent: 10px;box-sizing: border-box;height: 30px;font-size: 14px;}
	.select{
		background: url(/static/img/xiala.png) no-repeat 97% center;background-size: 15px;
	}
</style>
